<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
    <title>智慧社区-物业管理</title>

    <meta name="description" content="Dashboard" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/resource/assets/css/component.css" />
    <link rel="shortcut icon" href="${pageContext.request.contextPath}/resource/assets/img/favicon.png" type="image/x-icon">

    <link href="${pageContext.request.contextPath}/resource/assets/css/bootstrap.min.css" rel="stylesheet" />
    <link href="${pageContext.request.contextPath}/resource/assets/css/font-awesome.min.css" rel="stylesheet" />
    <link href="${pageContext.request.contextPath}/resource/assets/css/beyond.min.css" rel="stylesheet" type="text/css" />
    <link href="${pageContext.request.contextPath}/resource/assets/css/animate.min.css" rel="stylesheet" />
    <link href="${pageContext.request.contextPath}/resource/assets/css/dataTables.bootstrap.css" rel="stylesheet" />
    
		<script src="${pageContext.request.contextPath}/resource/assets/js/modernizr.custom.js"></script>
    <!--Skin Script: Place this script in head to load scripts for skins and rtl support-->
    <script src="${pageContext.request.contextPath}/resource/assets/js/skins.min.js"></script>

</head>
<body>
<div class="md-modal md-effect-11" id="modal-11">
			<div class="md-content">
			 <div class="modal-palegreen">
				 <div class="modal-dialog">
                                                    <div class="modal-content">
                                                        <div class="modal-header">
                                                            <button type="button" class="close" data-dismiss="modal" aria-hidden="true" onclick="closeModal()">×</button>
                                                            <h4 class="modal-title">发送消息</h4>
                                                        </div>
                                                        <div class="modal-body">
                                                            <div class="row">
                                                                <div class="col-sm-12">
                                                                    <div class="form-group">
                                                                        <label for="exampleInputEmail2" id="receiver">消 息：</label>
                                                                        <span class="input-icon icon-right">
                                                                            <textarea class="form-control" rows="10" id="message"></textarea>
                                                                            <i class="glyphicon glyphicon-briefcase darkorange"></i>
                                                                        </span>
                                                                    </div>
                                                                    <input type="hidden" name="receiveId" id="receiveId"  />
                                                                </div>
                                                            </div>
                                                        </div>
                                                        <div class="modal-footer">
                                                            <button type="button" class="btn btn-warning" data-dismiss="modal" onclick="closeModal()">取 消</button>
                                                            <button type="button" class="btn btn-primary" onclick="sendMessage()">发 送</button>
                                                        </div>
                                                    </div><!-- /.modal-content -->
                                                </div><!-- /.modal-dialog -->
                                                </div>
			</div>
		</div>
<%@include file="../header.jsp" %>
	<!-- Main Container -->
    <div class="main-container container-fluid">
        <!-- Page Container -->
        <div class="page-container">
            <!-- Page Sidebar -->
            <%@include file="../nav.jsp" %><!-- /Page Sidebar -->
            <!-- Page Content -->
            <div class="page-content">
                <!-- Page Breadcrumb -->
                <div class="page-breadcrumbs">
                    <ul class="breadcrumb" style="margin-top: 8px;">
                        <li>
                            <i class="fa fa-home"></i>
                            <a href="../property.jsp">首页</a>
                        </li>
                        <li>用户管理</li>
                        <li class="active">附属用户</li>
                    </ul>
                </div><!-- /Page Breadcrumb -->
                <!-- Page Header -->
                <div class="page-header position-relative">
                    <div class="header-title" style="margin-top: 2px;">
                        <h1>
                            附属用户
                        </h1>
                    </div><!--Header Buttons-->
                    <div class="header-buttons">
                        <a class="sidebar-toggler" href="#">
                            <i class="fa fa-arrows-h"></i>
                        </a>
                        <a class="refresh" id="refresh-toggler" href="">
                            <i class="glyphicon glyphicon-refresh"></i>
                        </a>
                        <a class="fullscreen" id="fullscreen-toggler" href="#">
                            <i class="glyphicon glyphicon-fullscreen"></i>
                        </a>
                    </div><!--Header Buttons End-->
                </div><!-- /Page Header -->
                <!-- Page Body -->
                <div class="page-body">
                	 <div class="row">
                        <div class="col-xs-12 col-md-12">
                            <div class="widget">
                                <div class="widget-header bordered-bottom bordered-yellow">
                                    <span class="widget-caption">搜索用户姓名</span>
                                    <div class="widget-buttons">
                                        <a href="#" data-toggle="maximize">
                                            <i class="fa fa-expand"></i>
                                        </a>
                                        <a href="#" data-toggle="collapse">
                                            <i class="fa fa-minus"></i>
                                        </a>
                                        <a href="#" data-toggle="dispose">
                                            <i class="fa fa-times"></i>
                                        </a>
                                    </div>
                                </div>
                                <div class="widget-body no-padding">
                                    <table class="table table-bordered table-hover table-striped" id="searchable" style="width: 100% !important;">
                                        <thead class="bordered-darkorange">
                                            <tr role="row">
                                                <th>头像</th>
						                      	<th>用户名</th>
						                        <th>姓名</th>
						                        <th>性别</th>
						                        <th>电话</th>
						                        <th>宿主用户</th>
						                        <th>房产信息</th>
						                        <th>操作</th>
                                            </tr>
                                        </thead>

                                        <tfoot>
                                            <tr>
                                                <th>头像</th>
						                      	<th>用户名</th>
						                        <th>姓名</th>
						                        <th>性别</th>
						                        <th>电话</th>
						                        <th>宿主用户</th>
						                        <th>房产信息</th>
						                        <th>操作</th>
                                            </tr>
                                        </tfoot>
                                        <tbody>
                                          
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>
                </div><!-- /Page Body -->
             </div><!-- /Page Content -->
     	</div><!-- /Page Container -->
     </div><!-- /Main Container -->
     <div class="md-overlay" onclick="closeModal()"></div>
     	<script src="${pageContext.request.contextPath}/resource/assets/js/jquery-2.0.3.min.js"></script>
    <script src="${pageContext.request.contextPath}/resource/assets/js/bootstrap.min.js"></script>

    <!--Beyond Scripts-->
    <script src="${pageContext.request.contextPath}/resource/assets/js/beyond.min.js"></script>
<script src="${pageContext.request.contextPath}/resource/assets/js/datatable/jquery.dataTables.min.js"></script>
    <script src="${pageContext.request.contextPath}/resource/assets/js/datatable/ZeroClipboard.js"></script>
    <script src="${pageContext.request.contextPath}/resource/assets/js/datatable/dataTables.bootstrap.min.js"></script>
		<script>
			var polyfilter_scriptpath = '/js/';
		</script>
		<script src="${pageContext.request.contextPath}/resource/assets/js/cssParser.js"></script>
		<script src="${pageContext.request.contextPath}/resource/assets/js/css-filters-polyfill.js"></script>
   <script src="${pageContext.request.contextPath}/resource/assets/js/bootbox/bootbox.js"></script>
   <script src="${pageContext.request.contextPath}/resource/layer/layer.js"></script>
    <script type="text/javascript">
    	var hostId = "${param.hostId}";
    	$(document).ready(function(){
    		$('#menu_user').addClass("active open");
    		$('#menu_attach').addClass("active");
    		$('#searchable').dataTable({
                "sDom": "Tflt<'row DTTTFooter'<'col-sm-6'i><'col-sm-6'p>>",
                "aLengthMenu": [
                                [50,75,100],
                                [50,75,100]
                             ],
                             "iDisplayLength": 50,
                "oLanguage": {
                    "sLengthMenu": "_MENU_",
                    "sZeroRecords": "对不起，查询不到任何相关数据",
                    "sInfo": "当前显示 _START_ 到 _END_ 条，共 _TOTAL_ 条记录",
                    "sInfoEmpty": "找不到相关数据",
                    "sInfoFiltered": "数据表中共为 _MAX_ 条记录)",
                    "sProcessing": "正在加载中...",
                    "sSearch": "",
                    "sUrl": "", 
                    "oPaginate": {
                        "sFirst":    " 首页",
                        "sPrevious": " 上一页 ",
                        "sNext":     " 下一页 ",
                        "sLast":     " 末页 "
                    }
                },
                "bStateSave": true,
                "bProcessing": false, 
         		"bServerSide": true,
         		"bSort": false,
         	    "sAjaxSource": "${pageContext.request.contextPath}/user_listAttach",
         	    "fnServerData": retrieveData, 
         	    "aoColumns":
         	           [  
         				{ "mData": "avatar",
         					"sDefaultContent" : "",
         					"sWidth":"60px",
         					"mRender": function (data, type, full) {
         						if(full.avatar!=null){
         							return "<div class='image' ><img src='"+full.avatar+"' class='img-circle' alt='User Image' style='width: 40px;height: 40px;' /></div>";
         						}else{
         							return "<div class='image' ><img src='${pageContext.request.contextPath}/resource/assets/img/avatars/divyia.jpg' class='img-circle' alt='User Image' style='width: 40px;height: 40px;' /></div>";
         						}
                     		}
         				},
         				{ "mData": "username","sDefaultContent" : ""},
         	        	{ "mData": "name","sDefaultContent" : ""}, 
         	        	{ "mData": "gender",
         	        		"sDefaultContent" : "",
         	        		"mRender": function (data, type, full) {
         	        			if(full.gender == null){
         	        				return "";
         	        			}else if(full.gender == "0"){
         							return "女";
         						}else{
         							return "男";
         						}
                     		}
         	        	},
         	        	{ "mData": "username","sDefaultContent" : ""},
         	        	{ "mData": "hostname","sDefaultContent" : "",
         	        		"mRender": function(data,type,full){
         						try{
         						  return full.parent.name;
         						} catch(e){
         						 
         						}      	    
         					}
         	        	},
         	        	{ "mData": "house","sDefaultContent" : "",
         	        		"mRender": function (data,type,full){
         	        			return "<a href='#' title='"+full.objectId+"' onclick='showHouses(this)'><i class='fa fa-navicon'></i> 详情</a>";
         	        		}	
         	        	},
         	        	
         	        	{ "mData": "operate",
         	        		"sDefaultContent" : "",
         	        		"sWidth":"160px",
         	        		"mRender": function (data,type,full){
         	        			return '<div class="btn-group">'+
         	        			'<a class="btn btn-azure md-trigger" data-modal="modal-11" title="'+full.objectId+'" name="'+full.name+'" href="#" onclick="showModal(this)">发送消息</a>'+
         	        			'<a class="btn btn-azure dropdown-toggle" data-toggle="dropdown" href="#"><i class="fa fa-angle-down"></i></a>'+
         		        		' <ul class="dropdown-menu dropdown-azure">'+
         		        		'<li><a id="'+full.objectId+'" title="'+full.deviceType+'" href="#" onclick="deleteUser(this)">删除用户</a></li>'+
         		        		 '</ul></div>';
         	        		}
         	        	}
         	            	
         	            ]
         		
            });
            
            function retrieveData( sSource,aoData, fnCallback) {
    			$.ajax({
    				"url" : sSource,
    				"data" : {"aoData":JSON.stringify(aoData),"attachId":hostId},
    				"type" : 'post',
    				"dataType" : 'json',
    				"success" : function(result) {
    					$('.loading-container').hide();
    					if(result == 201){
    						alert("鉴权已过期，请重新登录");
    						location.href="/WisdomHome";
    						return;
    					}
    					fnCallback(result);
    				},
    				"error" : function(msg) {
    					alert("error msg:"+msg.responseText);
    				}
    			});
    		}
            
    	});
    	
    	function showHouses(obj){
    		location.href="${pageContext.request.contextPath}/view/listHouse?attachId="+obj.title;
    	}
    	
    	function showModal(obj){
    		$('#receiveId').val(obj.title);
    		$('#receiver').html(obj.name+" :");
    		$('#modal-11').addClass("md-show");
    	}
    	
    	function closeModal(){
    		$('#modal-11').removeClass("md-show");
    	}
    	
    	function sendMessage(){
    		var uid = $('#receiveId').val();
    		var message = $('#message').val();
    		
    		if($.trim(message) == ""){
    			return;
    		}
    		
    		$.ajax({
    			"url" : "${pageContext.request.contextPath}/push_toUser",
				"data" : {uid:uid,message:message},
				"type" : 'post',
				"dataType" : 'json',
				"success" : function(result) {
					if (result == 200) {
						alert("发送成功");
						closeModal();
					}else {
						alert("鉴权已过期，请重新登录");
						location.href="/WisdomHome";
						return;
					}
				},
				"error" : function(msg) {
					alert("error msg:"+msg.responseText);
				}
    		});
    	}
    	
    	function deleteUser(obj){
    		if (obj.title != "3") {
    			layer.msg('该账号已被业主使用,无法删除', {icon: 2});
				return;
			}
    		if(confirm("警告：删除用户后，此用户无法再通过客户端登陆，并且无法恢复，确定删除？")){
    			$.ajax({
    				url:'${pageContext.request.contextPath}/manager_deleteUser',
    				data:{objectId:obj.id},
    				type:'post',
    				dataType:'json',
    				success:function(result){
    					if(result == 201){
    						alert("鉴权已过期，请重新登录");
    						location.href="/WisdomHome";
    						return;
    					}
    					alert("删除用户成功");
    					//location.href="${pageContext.request.contextPath}/jsp/user/fushu.jsp";
    				},
    				error:function(msg){
    					alert("error msg:"+msg.responseText);
    				}
    			});
    		}
    	}
    	
    </script>
</body>
</html>